<div class='container show-badge {{model.slug}}'>
  <h1>
    {{#link-to 'badges.index'}}{{i18n 'badges.title'}}{{/link-to}}
     /
    {{model.name}}
  </h1>

  <div class='show-badge-details'>
    {{badge-card badge=model size="large" count=userBadges.grant_count}}
    <div class='badge-grant-info'>
      <div>
        <div class='grant-info-item'>
          {{check-mark checked=model.allow_title}} {{i18n 'badges.allow_title'}}
        </div>
        <div class='grant-info-item'>
          {{check-mark checked=model.multiple_grant}} {{i18n 'badges.multiple_grant'}}
        </div>
      </div>
    </div>
  </div>

  {{#if userBadges}}
    <div class="user-badges {{model.slug}}">
      {{#load-more selector=".badge-info" action="loadMore"}}
        {{#each userBadges as |ub|}}
          {{#user-info user=ub.user size="medium" class="badge-info" date=ub.granted_at}}
            <div class="granted-on">{{i18n 'badges.granted_on' date=(inline-date ub.granted_at)}}</div>
            {{#if ub.post_number}}
              <a class="post-link" href="{{unbound ub.topic.url}}/{{unbound ub.post_number}}">{{{ub.topic.fancyTitle}}}</a>
            {{/if}}
          {{/user-info}}
        {{/each}}
      {{/load-more}}

      {{#unless canLoadMore}}
        {{#if canShowOthers}}
        <div class='clearfix'>
          <a class='btn' href='{{model.url}}'>{{i18n 'badges.others_count' count=model.grant_count}}</a>
        </div>
        {{/if}}
      {{/unless}}
    </div>

    {{conditional-loading-spinner condition=canLoadMore}}
  {{/if}}
</div>
